<template>
  <div class="mycoment_1">
    <div class="mycoment" v-for="(item,index) in info">
      <router-Link to=""><div class="mycoment_picture"><img class="mycoment_picture_main" :src="item.picture" height="151" width="276"/></div></router-Link>
      <div class="mycoment_name">
        <h4 style="padding-top: 5px">课程名：{{item.name}}</h4>
        <p>我的评论：{{item.content}}</p>
      </div>
      <div class="shanchu">
        <p>{{mycoment_time[index]}}</p>
        <el-button type="text" class="button" @click='shanchu(item.id),info.splice(index,1)'>删除评论</el-button>
<!--        <input type="submit" class="button" v-on:click='shanchu(item.id)' value="删除评论">-->
      </div>
    </div>

  </div>
</template>

<script>
  // import Bus from '../Bus'
    export default {
      name: "Mycoment",
      data(){
        return{
          seen: false,
          mycoment_time:[],
          info:{"img_url":require('../../img/训练计划.jpg'),"name":"课程名称:","my_coment":"我的评论:","mycoment_time":"评论时间:","mycoment_del":"删除评论:"},
        }
      },
      created() {
        var telephone=this.$store.state.telephone
        var this_=this
          this.$axios.get('http://127.0.0.1:8080/my_comment/comment', {
            params: {
              telephone:telephone
            }
          })
            .then(function (response) {
              this_.info=response.data
              console.log(this_.info)
              for(var i=0;i<this_.info.length;i++){
                console.log((new Date(this_.info[i].create_time)).toISOString().slice(0,10))
                this_.mycoment_time.push((new Date(this_.info[i].create_time)).toISOString().slice(0,10));
              }
              // console.log(this_.info[0].id);
            })
            .catch(function (error) {
              console.log(error);
            });
      },
      methods:{
        shanchu:function (id) {
          var this_=this
          this.$axios.get('http://127.0.0.1:8080/my_comment/delcomment', {
            params: {
              id:id
            }
          })
            .then(function (response) {
              console.log(response.data.code)
              if(response &&response.data.code==="1012"){
                this_.$message({
                  message: '删除成功',
                  type: 'success'
                });
              }
              else{
                this_.$message.error('已删除');
              }
            })
            .catch(function (error) {
              console.log(error);
            });
        },
        },
      watch:{
        "id":function () {

        }
      }
    }
</script>

<style scoped>
  a{
    color: black;
  }
  .mycoment{
    background: white;
    width: 100%;
    height: 160px;
    margin-bottom: 1px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transition: 0.3s;
  }
  .mycoment .mycoment_picture{
    width: 300px;
    height: 160px;
    float: left;
    margin-right: 10px;
  }
  .mycoment .mycoment_picture img{
    margin-top: 8px;
    margin-left: 15px;
    width:90%;height:90%
  }
  .shanchu{
    float: right;
    margin-top: 60px;
  }
  .shanchu .button:hover{
    color: red;
  }
  .mycoment_1{
    min-height: 400px;
  }
</style>
